<template>
    <div style='height: 355px'>
        <el-scrollbar style='height: 105%' >
            <el-table
                :show-header='false'
                :data='tableData'
                style='width:100%;'>
<!--                <el-table-column prop='courseName'></el-table-column>-->
                <el-table-column>
                    <template #default='scope'>
                        <div style='display: inline-block'>
<!--                            标题-->
                            <div>
                                {{ scope.row.courseName }}
                            </div>
<!--                            状态-->
                        </div>
<!--                        前往-->
                        <div style='display: inline-block; position:absolute; right: 20px'>
                            <el-tag
                                :type="
                                scope.row.grade >= 90
                                    ? 'success'
                                    : scope.row.grade >= 60
                                    ? ''
                                    : 'danger'
                            "
                            >{{ scope.row.grade }}
                            </el-tag>
<!--                            <a href='#'>前往</a>-->
                        </div>
                    </template>
                </el-table-column>
            </el-table>
        </el-scrollbar>
    </div>
</template>

<script>

import Qs from 'qs'
export default {
    name: 'RecentContest',
    props: ['id1'],
    data() {
        return {
            tableData: [],
            username: '',
            map: new Map(),
            id: localStorage.getItem("ms_userid"),
            id1: 0
        };
    },
    mounted: function() {
        this.load_status();
    },
    computed: {
        role() {
            return localStorage.getItem("ms_character") === "supervisor" ? '管理员' : localStorage.getItem("ms_character") === "teacher" ? "教师" : "学生";
        },
        user_name() {
            return localStorage.getItem("ms_username");
        }
    },
    methods: {
        async load_status() {
            let _this = this;
            let id = localStorage.getItem("ms_userid");
            let role = this.role
            await this.$route.query.id
            this.id1 = this.$route.query.id
            console.log(this.id1)
            if(this.id1) {
                id = this.id1
                role = "学生"
            }
            // console.log(id)
            // console.log("???")
            await this.$axios.post('/gradeInfo/filter', Qs.stringify({
                "id": id,
                "courseName": "",
                "semester": "",
                "type": role,
                "studentName": "",
                "teacherName": ""})).then(resp => {
                if(resp && resp.status === 200) {
                    // console.log(resp.data)
                    _this.tableData = resp.data
                }
            })
        },
        get_prob_name() {
            let _this = this;
            for(let i = 0; i < this.tableData.length; i++) {
                console.log(_this.tableData[i].probID, ':')
                this.$axios.get('/problems/get_name/' + _this.tableData[i].probID).then(resp => {
                    if (resp && resp.status === 200) {
                        console.log(_this.tableData[i].probID, ':', resp.data)
                        _this.map.set(_this.tableData[i].probID, resp.data)
                    }
                });
            }
        }
    }
};
</script>

<style scoped>

* {
    font-size: 14px;
}

.el-scrollbar__wrap {
    overflow-x: hidden;
}

</style>
